<template>
    <a-date-picker :placeholder="placeholder"
    :allowClear="true"
    format="YYYY-MM-DD" v-model="stateValue" @change="change"></a-date-picker>
</template>

<script>
  // 日期选择器
  import moment from 'moment';
    export default {
        name: "AkDatePicker",
        props:{
          placeholder:{
            type:String,
            required:false,
            default:"请选择"
          },
          value:{
            type:String,
            required:false,
            default: ''
          },

        },
        data() {
          return {
            stateValue: null
          }
        },
        mounted(){
          if(this.value){
            this.stateValue = moment(this.value);
          }else{
            this.stateValue = null;
          }
        },
        watch:{
          value(value){
            if(value){
              this.stateValue = moment(value);
            }else{
              this.stateValue = null;
            }
          }
        },
        methods:{
          change(date, dateStr){
            this.$emit('change', dateStr);
          }
        },
        model: {
          prop: 'value',
          event: 'change'
        }

    }
</script>

<style scoped>

</style>